$(document).ready(function() {

    var viwer;
    var head = "";

    var datatype = $("#wrapper").attr("datatype");
    if (datatype == "view") {

        viwer = "../上传/";
    } else {
        viwer = '';
    }
    var ww = $(window).width();
    var wh = $(window).height();

    // var vConsole = new VConsole();

    var firstLoadFiles = {
        "files": [{
                "type": "IMAGE",
                "source": viwer + "images/loading/bg.jpg",
                "size": 1
            }, {
                "type": "IMAGE",
                "source": viwer + "images/p1/bg.jpg",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p1/bt.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p2/text.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/bg.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/bottom.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/child.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/count-bar.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/1.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/2.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/3.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/drops/drop-bomb.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/drops/drop-clock.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/drops/drop-gift1.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/drops/drop-gift2.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/drops/drop-gift3.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/drops/drop-gift4.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/drops/drop-gift5.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/drops/drop-horn.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/drops/drop-snow.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/drops/drop-socks.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/drops/drop-sugar.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/effects/effect-bomb.gif",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/effects/effect-clock.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/effects/effect-horn.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/effects/effect-snow.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p3/effects/effect-socks.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p4/bg.jpg",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p4/title0.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p4/title.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p4/title10.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p4/btn-again.png",
                "size": 1
            },
            {
                "type": "IMAGE",
                "source": viwer + "images/p4/btn-share.png",
                "size": 1
            }
        ]
    };

    $.html5Loader({
        filesToLoad: firstLoadFiles,
        onBeforeLoad: function() {},
        onComplete: function() {
            // $.html5Loader({filesToLoad: bgLoadFiles});
            setTimeout(function() {
                $('.loading').hide();
                pg1();
            }, 1000)
        },
        onElementLoaded: function(obj, elm) {},
        onUpdate: function(percentage) {
            // console.log(percentage);

            var s = percentage / 100 * 82;
            var ss = percentage - (100);
            // console.log(ss);
            $('.laoren').css('left', s + '%')
            $('.line').css('left', ss + '%')
        }
    });

    // pg1
    function pg1() {
        $('.page1').show();
        $('.p1_bt').click(function() {
            $('.page1').hide();
            pg2();
        })
    };

    // pg2
    function pg2() {
        $('.page2').show();

        setTimeout(function() {
            $('.page2').hide();
            $('.page3').show();
            pg3();
        }, 2000)
    };

    // pg3
    // 游戏页面适配
    function ImgUpdata(){

        // alert(ww+''+wh);

        if( wh/ww > 1.9){
            // x不带bar
            // alert('wh/ww > 1.9');
            $('.bg-bottom').css('top', '72%');
            $('.move-area').css('height', '81%');
        }

        if(wh/ww > 1.76 && wh/ww < 1.9){
            //
            // alert('wh/ww > 1.76 && wh/ww < 1.9');
            $('.bg-bottom').css('top', '73%');
            $('.move-area').css('height', '76%');

        }

        if(wh/ww < 1.76 && wh/ww >1.7){
            // x带bar
            // alert('wh/ww < 1.76 && wh/ww >1.7');
            $('.bg-bottom').css('top', '72%');
            $('.move-area').css('height', '74%');
        }


        if(wh/ww < 1.63 && wh/ww >1.51){
            // 5s不带bar, 6s
            // alert('wh/ww < 1.63 && wh/ww >1.51');
            $('.bg-bottom').css('top', '71%');
            $('.move-area').css('height', '69%');
        }

        if(wh/ww < 1.51){
            // 5s带bar
            // alert('wh/ww < 1.51');
            $('.bg-bottom').css('top', '70%');
            $('.move-area').css('height', '66%');
        }
    };
    var resetPage = setTimeout(function() {
        ImgUpdata();
    }, 1000);
    
    // 数值设定
    var childHeight, // 孩纸的高度；
        childTop, // 孩纸距离顶部的高度
        pileHeight; // 堆叠物品高度
    var hClock, // 钟表高度
        hSnow, // 雪块高度
        hSugar, // 姜饼人高度
        hSocks, // 袜子高度
        hBomb, // 炸弹高度
        hHorn, // 鹿角高度
        hGift1, // 礼物1高度
        hGift2, // 礼物2高度
        hGift3, // 礼物3高度
        hGift4, // 礼物4高度
        hGift5; // 礼物5高度
    var dropInterval = ($(window).width() * 40) / (4 * 188), // 物品png上下空白的距离
        childInterval = ($(window).width() * 37) / (4 * 188), // 孩纸左右空白的距离 
        dropAreaInterval = $(window).width() / 4; //每块掉落区域的宽度

    // 限定物品 闹钟x1; 鹿角x1; 雪块x1; 袜子x1; 炸弹x3; 姜饼人x3;
    var dropsLimit = ['clock', 'horn', 'snow', 'socks', 'bomb', 'bomb', 'bomb', 'sugar', 'sugar', 'sugar'],
        // var dropsLimit = ['clock'],
        // 非限定物品 礼物x5
        dropsUnlimit = ['gift1', 'gift2', 'gift3', 'gift4', 'gift5'],
        // 掉落的区域
        dropArea = ['left0', 'left25', 'left50', 'left75'];
    // 可计数的物品
    var countBomb = 0, // 炸弹数为0
        countGift = 0, // 礼物数为0
        countClock = 0, // 时钟数为0
        countHorn  = 0, // 鹿角数为0
        countSnow = 0, // 雪块数为0
        countSocks = 0, // 袜子数为0
        countSugar = 0; // 姜饼人数为0
    // 是否可移动，默认不可以
    var canMove = false;
    // 游戏时间，默认15s
    var gameTime = 15;
    // 游戏时间是否增加了，默认没有
    var isTimeAdd = false;

    function pg3() {
        // 重置页面和数据
        function resetData() {
            $('.count-down').css('display', 'block');
            $('.count-down-number').attr('src', viwer + 'images/p3/3.png');
            //移除效果
            $('.child').siblings().remove();
            childHeight = $('.child').height();
            childTop = $('.child').offset().top;
            pileHeight = childHeight;
            // 移除堆叠物品
            $('.piles-area').empty();
            // 堆叠区域的高度等于孩纸距离顶部的高度加上物品png上下空白的距离
            $('.piles-area').height(childTop + dropInterval);
            // 掉落区域的高度等于孩纸距离顶部的高度加上物品png上下空白的距离， 测试用
            $('.help-area').height(childTop + dropInterval);
            hClock = $('.sample-clock').height();
            hSnow = $('.sample-snow').height();
            hSugar = $('.sample-sugar').height();
            hSocks = $('.sample-socks').height();
            hBomb = $('.sample-bomb').height();
            hHorn = $('.sample-horn').height();
            hGift1 = $('.sample-gift1').height();
            hGift2 = $('.sample-gift2').height();
            hGift3 = $('.sample-gift3').height();
            hGift4 = $('.sample-gift4').height();
            hGift5 = $('.sample-gift5').height();
            // console.log(hClock);
            // console.log(hSnow);
            // console.log(hSugar);
            // console.log(hSocks);
            // console.log(hBomb);
            // console.log(hHorn);
            // console.log(hGift1);
            // console.log(hGift2);
            // console.log(hGift3);
            // console.log(hGift4);
            // console.log(hGift5);
            // 计数条的高度
            $('.count-bar').css('top', $('.move-area').height() + 5);
            // 限定物品 闹钟x1; 鹿角x1; 雪块x1; 袜子x1; 炸弹x3; 姜饼人x3;
            dropsLimit = ['clock', 'horn', 'snow', 'socks', 'bomb', 'bomb', 'bomb', 'sugar', 'sugar', 'sugar'];
            // 可计数的物品
            countBomb = 0; // 炸弹数为0
            $('.count-bomb').text(countBomb);
            countGift = 0; // 礼物数为0
            $('.count-gift').text(countGift);
            countClock = 0; // 时钟数为0
            $('.count-clock').text(countClock);
            countHorn  = 0; // 鹿角数为0
            countSnow = 0; // 雪块数为0
            countSocks = 0; // 袜子数为0
            countSugar = 0; // 姜饼人数为0
            // 是否可移动，默认不可以
            canMove = false;
            // 游戏时间，默认15s
            gameTime = 15;
            $('.timer').text(gameTime);
            // 游戏时间是否增加了，默认没有
            isTimeAdd = false;
            // console.log('resetData');
        }
        // 延迟获取页面数值，若是没有重置过数据，重置数据
        var delayReset = setTimeout(function() {
            resetData();
            clearTimeout(delayReset);
        }, 1000);

        // 对应的掉落物品高度
        function setDropHeight(name) {
            switch (name) {
                case 'clock':
                    return hClock;
                    break;
                case 'snow':
                    return hSnow;
                    break;
                case 'sugar':
                    return hSugar;
                    break;
                case 'socks':
                    return hSocks;
                    break;
                case 'bomb':
                    return hBomb;
                    break;
                case 'horn':
                    return hHorn;
                    break;
                case 'gift1':
                    return hGift1;
                    break;
                case 'gift2':
                    return hGift2;
                    break;
                case 'gift3':
                    return hGift3;
                    break;
                case 'gift4':
                    return hGift4;
                    break;
                case 'gift5':
                    return hGift5;
                    break;
                default:
                    //
            }
        };

        // 倒计时，一打开就开始
        function countDown() {
            var countDownAn = new TimelineMax({});
            countDownAn.to($('.count-down-number'), 1, {onStart: function() { $('.count-down-number').attr('src', viwer + 'images/p3/2.png')}}, '+=1');
            countDownAn.to($('.count-down-number'), 1, {onStart: function() { $('.count-down-number').attr('src', viwer + 'images/p3/1.png')}, onComplete: function() {
                $('.count-down').fadeOut('fast', function() {
                    // 可以移动
                    canMove = true;
                    // 游戏开始计时
                    timer($('.timer'));
                    // 物品开始掉落
                    dropTimer();
                });
            }});
        };
        countDown();

        // 游戏计时器
        function timer(el) {
            var timer = setInterval(function() {
                if (isTimeAdd) {
                    gameTime += 6;
                    isTimeAdd = false;
                }
                gameTime--;
                el.text(gameTime);
                if (gameTime == 0) {
                    clearInterval(timer);
                    setTimeout(function() {
                        // game over
                        canMove = false;
                        $('.page3').hide();
                        pg4(countBomb, countGift, countClock, countHorn, countSnow, countSocks, countSugar);
                        resetData();
                    }, 1000);
                };
            }, 1000);
        };

        // 物品掉落
        function dropTimer() {
        var dropTimer = setInterval(function() {
                if (gameTime == 0) {
                    clearInterval(dropTimer);
                    return;
                };
                dropAnFun();
            }, 1000);
        };

        // 重力感应
        var i = 0;
        var o = new Orienter();
        var opj;
        o.onOrient = function(obj) {
            if (!canMove) {
                return;
            }
            var moving = new TimelineMax({});

            if (obj.g > 40) {
                opj = 75;
            } else if (obj.g < -40) {
                opj = 0;
            } else {
                opj = obj.g + 36;
            }

            if (obj.a == 0) {
                // console.log('初始')
            };

            if (obj.g < 0 && obj.g >= -90) {
                // 向左转动
                moving.to($('.move-area'), 0.3, {
                    left: opj + '%',
                    ease: Power0.easeNone,
                    onUpdate: function() {
                        //
                    }
                });
            } else if (obj.g > 0 && obj.g <= 90) {
                // 向右转动
                moving.to($('.move-area'), 0.3, {
                    left: opj + '%',
                    ease: Power0.easeNone,
                    onUpdate: function() {
                        //
                    }
                });
            } else {
                // 
            }
        };
        o.init();

        // 掉落物品
        function dropAnFun() {
            if (dropsLimit.length > 0) {
                // 限定物品还有剩余
                var dropArrNum = Math.floor(Math.random() * 2);
                if (dropArrNum == 0) {
                    // 执行限定物品掉落
                    dropsLimitFun();
                } else {
                    // 执行非限定物品掉落
                    dropsUnlimitFun();
                }
            } else {
                // 限定物品没有剩余
                // 执行非限定物品掉落
                dropsUnlimitFun();
            }
        };

        // 掉落限定物品函数
        function dropsLimitFun() {
            // 限定物品，随机选一个
            var dropNum = Math.floor(Math.random() * dropsLimit.length);
            // 掉落的区域，随机选一个
            var dropAreaNum = Math.floor(Math.random() * 4);
            // var dropAreaNum = 1;
            // 掉落物品的名字
            var dropName = dropsLimit[dropNum];
            // 动态生成图片
            var $img = $('<img class="drops drop-' + dropName + ' ' + dropArea[dropAreaNum] + '" src="' + viwer + 'images/p3/drops/drop-' + dropName + '.png" />');
            // 移动到刚好物品高度一样的位置
            $($img).css('top', -setDropHeight(dropName));
            // 将图片放进页面
            $('.help-area').after($img);
            // 从限定物品数组里移除选出的物品
            dropsLimit.splice(dropNum, 1);
            // console.log(dropsLimit);
            // 物品掉落
            var dropping = new TimelineMax({});
            dropping.to($($img), 1, {
                'top': childTop + 'px',
                ease: Power0.easeNone,
                onStart: function() {
                    // 
                },
                onUpdate: function() {
                    // 达到堆叠高度的时候
                    if ($($img).offset().top >= ($('.move-area').height() - (pileHeight + setDropHeight(dropName) - dropInterval)) && $($img).offset().top <= ($('.move-area').height() - (pileHeight + setDropHeight(dropName) - dropInterval) + dropInterval)) {
                        if (dropAreaNum == 0) {
                            // 掉落一区
                            if ($('.child').offset().left <= setLeft1(0.7)) {
                                // 接住了
                                dropping.kill();
                                afterDrop(dropName);
                                $($img).hide();
                                $($img).remove();
                            } else {
                                // 没接住
                            }
                        } else if (dropAreaNum == 1) {
                            // 掉落二区
                            if ($('.child').offset().left >= setLeft2L(0.7) && $('.child').offset().left <= setLeft2R(0.7)) {
                                // 接住了
                                dropping.kill();
                                afterDrop(dropName);
                                $($img).hide();
                                $($img).remove();
                            } else {
                                // 没接住
                            }
                        } else if (dropAreaNum == 2) {
                            // 掉落三区
                            if ($('.child').offset().left >= setLeft3L(0.7) && $('.child').offset().left <= setLeft3R(0.7)) {
                                // 接住了
                                dropping.kill();
                                afterDrop(dropName);
                                $($img).hide();
                                $($img).remove();
                            } else {
                                // 没接住
                            }
                        } else {
                            // 掉落四区
                            if ($('.child').offset().left >= setLeft4(0.7)) {
                                // 接住了
                                dropping.kill();
                                afterDrop(dropName);
                                $($img).hide();
                                $($img).remove();
                            } else {
                                // 没接住
                            }
                        }
                    };
                },
                onComplete: function() {
                    // 若是没有在堆叠区域范围内接住，则物品会径直掉落到底并消失
                    if ($img) {
                        $($img).fadeOut(function() {
                            dropping.kill();
                            $($img).remove();
                        });
                    };
                }
            });
        };
        // 掉落非限定物品函数
        function dropsUnlimitFun() {
            // 非限定物品，随机选一个
            var dropNum = Math.floor(Math.random() * dropsUnlimit.length);
            // 掉落的区域，随机选一个
            var dropAreaNum = Math.floor(Math.random() * 4);
            // var dropAreaNum = 1;
            // 掉落物品的名字
            var dropName = dropsUnlimit[dropNum];
            // 动态生成图片
            var $img = $('<img class="drops drop-' + dropName + ' ' + dropArea[dropAreaNum] + '" src="' + viwer + 'images/p3/drops/drop-' + dropName + '.png" />');
            // 移动到刚好物品高度一样的位置
            $($img).css('top', -setDropHeight(dropName));
            // 将图片放进页面
            $('.help-area').after($img);
            // 物品掉落
            var dropping = new TimelineMax({});
            dropping.to($($img), 1, {
                'top': childTop + 'px',
                ease: Power0.easeNone,
                onStart: function() {
                    // 
                },
                onUpdate: function() {
                    // 达到堆叠高度范围的时候
                    if ($($img).offset().top >= ($('.move-area').height() - (pileHeight + setDropHeight(dropName) - dropInterval)) && $($img).offset().top <= ($('.move-area').height() - (pileHeight + setDropHeight(dropName) - dropInterval) + dropInterval)) {
                        if (dropAreaNum == 0) {
                            // 掉落一区
                            if ($('.child').offset().left <= setLeft1(0.7)) {
                                // 接住了
                                dropping.kill();
                                afterDrop(dropName);
                                $($img).hide();
                                $($img).remove();
                            } else {
                                // 没接住
                            }
                        } else if (dropAreaNum == 1) {
                            // 掉落二区
                            if ($('.child').offset().left >= setLeft2L(0.7) && $('.child').offset().left <= setLeft2R(0.7)) {
                                // 接住了
                                dropping.kill();
                                afterDrop(dropName);
                                $($img).hide();
                                $($img).remove();
                            } else {
                                // 没接住
                            }
                        } else if (dropAreaNum == 2) {
                            // 掉落三区
                            if ($('.child').offset().left >= setLeft3L(0.7) && $('.child').offset().left <= setLeft3R(0.7)) {
                                // 接住了
                                dropping.kill();
                                afterDrop(dropName);
                                $($img).hide();
                                $($img).remove();
                            } else {
                                // 没接住
                            }
                        } else {
                            // 掉落四区
                            if ($('.child').offset().left >= setLeft4(0.7)) {
                                // 接住了
                                dropping.kill();
                                afterDrop(dropName);
                                $($img).hide();
                                $($img).remove();
                            } else {
                                // 没接住
                            }
                        }
                    };
                },
                onComplete: function() {
                    // 若是没有在堆叠区域范围内接住，则物品会径直掉落到底并消失
                    if ($img) {
                        $($img).fadeOut(function() {
                            dropping.kill();
                            $($img).remove();
                        });
                    };
                }
            });
        };

        // 掉落一区，获取有效区域，p为所占百分比
        function setLeft1(p) {
            var left = dropAreaInterval - (dropAreaInterval - childInterval * 2) * p - childInterval;
            return left;
        };
        // 掉落二区，获取有效区域，p为所占百分比，分左边和右边
        function setLeft2L(p) {
            var left = dropAreaInterval + (dropAreaInterval - childInterval * 2) * p + childInterval - dropAreaInterval;
            return left;
        };

        function setLeft2R(p) {
            var left = dropAreaInterval * 2 + (dropAreaInterval - childInterval * 2) * (1 - p) + childInterval - dropAreaInterval;
            return left;
        };
        // 掉落三区，获取有效区域，p为所占百分比，分左边和右边
        function setLeft3L(p) {
            var left = dropAreaInterval * 2 + (dropAreaInterval - childInterval * 2) * p + childInterval - dropAreaInterval;
            return left;
        };

        function setLeft3R(p) {
            var left = dropAreaInterval * 3 + (dropAreaInterval - childInterval * 2) * (1 - p) + childInterval - dropAreaInterval;
            return left;
        };
        // 掉落四区，获取有效区域，p为所占百分比
        function setLeft4(p) {
            var left = dropAreaInterval * 3 + (dropAreaInterval - childInterval * 2) * p + childInterval - dropAreaInterval;
            return left;
        };

        // 接住了之后，堆叠物品或显示效果
        function afterDrop(dropName) {
            var newDropName = dropName.replace(/\d+$/, '');
            if (newDropName == 'gift' || newDropName == 'sugar') {
                // 可堆叠物品
                // 动态生成图片
                var $img = $('<img class="piles pile-' + dropName + '" src="' + viwer + 'images/p3/drops/drop-' + dropName + '.png" />');
                if ($('.piles-area').children().length == 0) {
                    // 第一个堆叠的物品
                    $($img).css('bottom', '0');
                    pileHeight = pileHeight + setDropHeight(dropName) - dropInterval;
                    $('.help-area').height($('.move-area').height() - pileHeight + dropInterval);
                } else {
                    // 之后的物品
                    $($img).css('bottom', pileHeight - (childHeight - dropInterval) - dropInterval * 2.7);
                    pileHeight = pileHeight + setDropHeight(dropName) - dropInterval * 2.7;
                    $('.help-area').height($('.move-area').height() - pileHeight + dropInterval);
                }
                // 将图片放进页面
                $('.piles-area').append($img);
                dropCount('add', newDropName);
            } else if (newDropName == 'horn') {
                // 戴鹿角
                var $img = $('<img class="effect-' + dropName + '" src="' + viwer + 'images/p3/effects/effect-' + dropName + '.png" />');
                $($img).css('bottom', childHeight - dropInterval * 1.5);
                // 将图片放进页面
                $('.child-area').append($img);
                dropCount('add', newDropName);
            } else if (newDropName == 'snow') {
                // 冰冻2s
                canMove = false;
                var $img = $('<img class="effect-' + dropName + '" src="' + viwer + 'images/p3/effects/effect-' + dropName + '.png" />');
                // 将图片放进页面
                $('.child-area').append($img);
                dropCount('add', newDropName);
                setTimeout(function() {
                    canMove = true;
                    $($img).hide();
                    $($img).remove();
                }, 2000);
            } else if (newDropName == 'clock') {
                // 加5s
                isTimeAdd = true;
                var $img = $('<img class="effect-' + dropName + '" src="' + viwer + 'images/p3/effects/effect-' + dropName + '.png" />');
                $($img).css('bottom', pileHeight - setDropHeight(dropName));
                // 将图片放进页面
                $('.child-area').append($img);
                dropCount('add', newDropName);
                $('.effect-' + dropName).animate({ 'left': '30%' }, function() {
                    $('.effect-' + dropName).fadeOut(function() {
                        $('.effect-' + dropName).remove();
                    });
                });
            } else if (newDropName == 'socks') {
                // 烟花
                var $img = $('<img class="effect-' + dropName + '" src="' + viwer + 'images/p3/effects/effect-' + dropName + '.png" />');
                $($img).css('bottom', pileHeight - setDropHeight(dropName));
                // 将图片放进页面
                $('.child-area').append($img);
                dropCount('add', newDropName);
                $('.effect-' + dropName).animate({ 'bottom': '+=30' }, function() {
                    $('.effect-' + dropName).fadeOut(function() {
                        $('.effect-' + dropName).remove();
                    });
                });
            } else if (newDropName == 'bomb') {
                // 炸弹
                var $img = $('<img class="effect-' + dropName + '" src="' + viwer + 'images/p3/effects/effect-' + dropName + '.gif" />');
                $($img).css('bottom', pileHeight - setDropHeight(dropName));
                // 将图片放进页面
                $('.child-area').append($img);
                dropCount('add', newDropName);
                // 如果有物品，减去一样物品
                if ($('.piles-area').children().length > 0) {
                    if ($('.piles-area').children().length == 1) {
                        // 第一件物品
                        pileHeight = pileHeight - $('.piles-area').children(':last').height() + dropInterval;
                    } else {
                        // 超过一件物品
                        pileHeight = pileHeight - $('.piles-area').children(':last').height() + dropInterval * 2.7;
                    };
                    // 如果是礼物，则减少一个
                    if (!$('.piles-area').children(':last').hasClass('pile-sugar')) {
                        dropCount('reduce', 'gift');
                    };
                    $('.piles-area').children(':last').remove();
                };
                // 1.9s后消失
                setTimeout(function() {
                    $('.effect-' + dropName).hide();
                    $('.effect-' + dropName).remove();
                }, 1900);
            };
            // 堆叠的高度超过了掉落区域的高度，则算游戏结束
            if (pileHeight > $('.move-area').height()) {
                // game over
                canMove = false;
                clearInterval(timer);
                clearInterval(dropTimer);
                $('.page3').hide();
                pg4(countBomb, countGift, countClock, countHorn, countSnow, countSocks, countSugar);
                resetData();
            };
        };
        // 接住了之后，计数器计算，type分为add和reduce
        function dropCount(type, newDropName) {
            switch (newDropName) {
                case 'bomb':
                    if (type == 'add') {
                        // 增加1个
                        countBomb += 1;
                    } else {
                        // 减少1个
                        countBomb -= 1;
                    };
                    $('.count-bomb').text(countBomb);
                    break;
                case 'gift':
                    if (type == 'add') {
                        // 增加1个
                        countGift += 1;
                    } else {
                        // 减少1个
                        countGift -= 1;
                    };
                    $('.count-gift').text(countGift);
                    break;
                case 'clock':
                    if (type == 'add') {
                        // 增加1个
                        countClock += 1;
                    } else {
                        // 减少1个
                        countClock -= 1;
                    };
                    $('.count-clock').text(countClock);
                    break;
                case 'horn':
                    if (type == 'add') {
                        // 增加1个
                        countHorn += 1;
                    } else {
                        // 减少1个
                        countHorn -= 1;
                    };
                    break;
                case 'snow':
                    if (type == 'add') {
                        // 增加1个
                        countSnow += 1;
                    } else {
                        // 减少1个
                        countSnow -= 1;
                    };
                    break;
                case 'socks':
                    if (type == 'add') {
                        // 增加1个
                        countSocks += 1;
                    } else {
                        // 减少1个
                        countSocks -= 1;
                    };
                    break;
                case 'sugar':
                    if (type == 'add') {
                        // 增加1个
                        countSugar += 1;
                    } else {
                        // 减少1个
                        countSugar -= 1;
                    };
                    break;
                default:
                    //
            }
        };
    };

    function pg4(countBomb, countGift, countClock, countHorn, countSnow, countSocks, countSugar) {
        $('.page4').show();
        // 成就数量
        var achievementNum = 0;
        console.log('炸弹：' + countBomb + ', 礼物：' + countGift + ', 时钟：' + countClock + ', 鹿角：' + countHorn + ', 雪块' + countSnow + ', 袜子' + countSocks + ', 姜饼人' + countSugar);
        // 确定标题区域
        function setTitle(n) {
            if(n == 0) {
                // 0个礼物
                $('.title').attr('src', viwer + 'images/p4/title' + n + '.png');
                $('.gift-num').attr('src', '');
            } else if(n > 0 && n < 10) {
                // 1-4个礼物
                $('.title').attr('src', viwer + 'images/p4/title.png');
                $('.gift-num').addClass('gift-num1');
                $('.gift-num').attr('src', viwer + 'images/p4/giftNum/' + n + '.png');
            } else {
                // 10+礼物
                $('.title').attr('src', viwer + 'images/p4/title10.png');
                $('.gift-num').addClass('gift-num2');
                if(n <= 30) {
                    $('.gift-num').attr('src', viwer + 'images/p4/giftNum/' + n + '.png');
                } else {
                    $('.gift-num').attr('src', viwer + 'images/p4/giftNum/30.png');
                }
            }
        };
        setTitle(countGift);

        // 确定成就
        function setAchievement() {
            // 炸弹成就
            if(countBomb == 3) {
                // 被炸3次
                var bombNum = Math.floor(Math.random() * 3);
                var $img = $('<img class="achievement" src="' + viwer + 'images/p4/achievement/bomb-' + bombNum + '.png" />');
                $('.achievement-area').append($img);
                achievementNum += 1;
            };
            // 礼物成就
            if(countGift == 0) {
                // 0礼物
                var gift1Num = Math.floor(Math.random() * 3);
                var $img = $('<img class="achievement" src="' + viwer + 'images/p4/achievement/gift1-' + gift1Num + '.png" />');
                $('.achievement-area').append($img);
                achievementNum += 1;
            } else if(countGift > 0 && countGift < 5) {
                // 1-4礼物
                var gift2Num = Math.floor(Math.random() * 3);
                var $img = $('<img class="achievement" src="' + viwer + 'images/p4/achievement/gift2-' + gift2Num + '.png" />');
                $('.achievement-area').append($img);
                achievementNum += 1;
            } else if(countGift > 4 && countGift < 10) {
                // 5-9礼物
                var gift3Num = Math.floor(Math.random() * 3);
                var $img = $('<img class="achievement" src="' + viwer + 'images/p4/achievement/gift3-' + gift3Num + '.png" />');
                $('.achievement-area').append($img);
                achievementNum += 1;
            } else {
                // 10+礼物
                var gift4Num = Math.floor(Math.random() * 3);
                var $img = $('<img class="achievement" src="' + viwer + 'images/p4/achievement/gift4-' + gift4Num + '.png" />');
                $('.achievement-area').append($img);
                achievementNum += 1;
            };
            // 时钟成就
            if(countClock > 0) {
                var clockNum = Math.floor(Math.random() * 3);
                var $img = $('<img class="achievement" src="' + viwer + 'images/p4/achievement/clock-' + clockNum + '.png" />');
                $('.achievement-area').append($img);
                achievementNum += 1;
            };
            // 鹿角成就
            if(countHorn > 0) {
                var hornNum = Math.floor(Math.random() * 3);
                var $img = $('<img class="achievement" src="' + viwer + 'images/p4/achievement/horn-' + hornNum + '.png" />');
                $('.achievement-area').append($img);
                achievementNum += 1;
            };
            // 雪块成就
            if(countSnow > 0) {
                var snowNum = Math.floor(Math.random() * 3);
                var $img = $('<img class="achievement" src="' + viwer + 'images/p4/achievement/snow-' + snowNum + '.png" />');
                $('.achievement-area').append($img);
                achievementNum += 1;
            };
            // 袜子成就
            if(countSocks > 0) {
                var socksNum = Math.floor(Math.random() * 3);
                var $img = $('<img class="achievement" src="' + viwer + 'images/p4/achievement/socks-' + socksNum + '.png" />');
                $('.achievement-area').append($img);
                achievementNum += 1;
            };
            // 姜饼人成就
            if(countSugar > 0) {
                var sugarNum = Math.floor(Math.random() * 3);
                var $img = $('<img class="achievement" src="' + viwer + 'images/p4/achievement/sugar-' + sugarNum + '.png" />');
                $('.achievement-area').append($img);
                achievementNum += 1;
            };
            setTimeout(function() {
                $('.achievement-num').attr('src', viwer + 'images/p4/achievementNum/' + achievementNum + '.png');
            }, 500);
        };
        setAchievement();

        // 再玩一次
        $('.btn-again').off('click');
        $('.btn-again').on('click', function(e) {
            e.stopPropagation();
            $('.page4').hide();
            // 重置数据
            achievementNum = 0;
            $('.gift-num').removeClass('.gift-num1');
            $('.gift-num').removeClass('.gift-num2');
            $('.achievement-area').empty();
            $('.page3').show();
            pg3();
        });
        // share
        $('.btn-share').on('click', function() {
            $('.page5').show();
        });
        $('.page5').on('click', function() {
            $('.page5').hide();
        })
    }
});



